<template>
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
        <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
            <van-cell v-for="(item, index) in list1.listArr" :key="index" :title="item.title" :value="item.value" :label="item.label" is-link center @click="routerPush(item)" />
        </van-list>
    </van-pull-refresh>
</template>

<script lang="ts" setup>
    import { markRaw, reactive, ref, toRaw, onMounted } from 'vue'
    import type { Ref } from 'vue'
    const props = withDefaults(defineProps<{
        list1?: any,
    }>(), {
        list1: {
            listArr: [],
            page: 1
        },
    })
    const emits = defineEmits<{
        (e:'update:list1', data: any): void
        (e:'updateList1', data: object): void
        (e:'routerPush', data: object): void
    }>()
    const loading: Ref<boolean> = ref(false);
    const finished: Ref<boolean> = ref(false);
    const refreshing: Ref<boolean> = ref(false);
    
    const onLoad = () => {
        if (refreshing.value) {
            emits('update:list1', {
                listArr: [],
                page: 1
            })
            refreshing.value = false;
        }
        // 调接口
        emits('updateList1', {
            data: {
                page: props.list1.page
            },
            callback: (result: any) => {
                console.log('获取父组件方法的返回值',result)
                console.log(props.list1)
                loading.value = false;
                if (props.list1.listArr.length == 0) {
                    finished.value = true;
                }
            },
        })

        
        // setTimeout(() => {
        //     if (refreshing.value) {
        //         emits('update:list1', [])
        //         // list1.value = [];
        //         refreshing.value = false;
        //     }

        //     for (let i = 0; i < 10; i++) {
        //         // list1.value.push(list1.value.length + 1);
        //         emits('update:list1', [...list1.value])
        //     }
        //     loading.value = false;

        //     if (list1.value.length >= 40) {
        //         finished.value = true;
        //     }
        // }, 1000);
    };

    const onRefresh = () => {
        // 清空列表数据
        finished.value = false;

        // 重新加载数据
        // 将 loading 设置为 true，表示处于加载状态
        loading.value = true;
        onLoad();
    };

    const routerPush = (val) => {
        // 跳转看是返回pdf还是什么
        emits('routerPush', val)
    }
</script>

<style lang="scss" scoped>
    :deep(.van-cell__title){
        flex: 3 !important;
    }
    :deep(.van-cell__value){
        flex: 1 !important;
    }
</style>